<template>
  <Dialog :title="dialogTitle" v-model="dialogVisible" :width="1400">
    <el-table
      ref="multipleTableRef"
      :max-height="450"
      v-loading="loading"
      :data="craftBookData"
      border
    >
      <el-table-column label="序号" align="center" type="index" width="80" />
      <el-table-column label="文件名称" align="center" prop="fileName" />
      <el-table-column label="文件类型" align="center" prop="fileType" />
      <el-table-column label="文件大小" align="center" prop="fileSize" />
      <el-table-column label="版本号" align="center" prop="version" />
      <el-table-column label="启用日期" align="center" prop="enableTime">
        <template #default="scope">
          <span>{{ formatDate(scope.row.enableTime) }}</span>
        </template>
      </el-table-column>
      <el-table-column label="停用日期" align="center" prop="stopTime">
        <template #default="scope">
          <span>{{ formatDate(scope.row.stopTime) }}</span>
        </template>
      </el-table-column>

      <el-table-column label="创建人" align="center" prop="creatorName" />
      <el-table-column label="创建时间" align="center" prop="createTime">
        <template #default="scope">
          <span>{{ formatDate(scope.row.createTime) }}</span>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <div>
      <Pagination
        :total="total"
        v-model:page="queryParams.pageNo"
        v-model:limit="queryParams.pageSize"
        @pagination="open"
      />
    </div>
  </Dialog>
</template>
<script setup lang="ts">
import * as CraftCourseApi from '@/api/config/craftCourse'
import { formatDate } from '@/utils/formatTime'
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('工序作业指导书') // 弹窗的标题
const loading = ref(false) // 表单的加载中
const total = ref(0) // 列表的总页数
const queryParams = reactive({
  pageNo: 1,
  pageSize: 50
})
const craftBookData = ref([]) // 表单数据

/** 打开弹窗 */
const open = async (dict) => {
  dialogVisible.value = true
  // 修改时，设置数据
  loading.value = true
  try {
    let params = {
      pageNo: queryParams.pageNo,
      pageSize: queryParams.pageSize,
      dictProcessName: dict.dictProcessName,
      partName: dict.partName,
      productNumber: dict.productNumber
    }
    const data = await CraftCourseApi.getCraftCourseBook(params)
    total.value = data.total
    craftBookData.value = data.list
  } finally {
    loading.value = false
  }
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
</script>
